<div data-role="content" data-bind="with: pickFriends" >
	
	<div>
		<label for="search-basic">Find Friends:</label>
		<input type="search" name="search" id="search-basic" value="" />
	</div>
	
	<div id="friends" data-bind="foreach: friends" data-role="controlgroup" >
    	<label data-theme="c">
    		<input type="checkbox" data-bind="checked: selected"  />
    		<span data-bind="text: name" />
    	</label>						
	</div>
	
	<div style="clear: both">
		<input type="button" value="Submit" data-bind="event: {vclick: Submit_Friends_List}"></input>
	</div>
	
	<div data-role="popup" id="friendsDialog" data-overlay-theme="a" data-theme="c" style="max-width:400px;" class="ui-corner-all">
		<div data-role="header" data-theme="a" class="ui-corner-top">
			<h1>Caption This!</h1>
		</div>
		<div data-role="content" data-theme="d" class="ui-corner-bottom ui-content">
			<h3 class="ui-title">Friends Selected</h3>			
			<a href="#" data-role="button" data-inline="true" data-transition="flow" data-theme="b" data-bind="event: {vclick: Navigate}">OK</a>  
		</div>
	</div>
</div>